<template>
  <div>
    <el-container>
      <el-header>
        <TopNav></TopNav>
      </el-header>
      <el-container>
        <el-aside width="200px">
          <LeftNav></LeftNav>
        </el-aside>
        <el-main class="bg">
          <router-view></router-view>
          <!-- <el-button @click="test">测试</el-button> -->
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import LeftNav from "./Student/LeftNav";
import TopNav from "./Student/TopNav";
import state from "../store/index";
import stuInfo from "../store/student";
import VueCookies from "vue-cookies";
import axios from "axios";
import qs from "qs";

export default {
  /**
   * 防止强制输入路由路径访问
   */
  beforeRouteEnter(from, to, next) {
    if (to.name != null) {
      // 当不是强制路由，而是由页面跳转来时，允许跳转
      next();
    } else {
      // 否则进行检查
      if (
        VueCookies.get("role") !== "student" &&
        VueCookies.get("role") !== "ta" &&
        VueCookies.get("role") !== "test"
      ) {
        next("/");
      } else {
        next();
      }
    }
  },
  created() {
    axios
      .post(
        "/api/getStudentInfo",
        qs.stringify({ authorizeToken: this.curInfo.authorizeToken })
      )
      .then((res) => {
        // console.log(res);
        stuInfo.commit("setStuInfo", res.data);
      })
      .catch((err) => {
        console.log(err);
      });

    axios
      .post(
        "/api/getClassByStudentId",
        qs.stringify({ student_id: this.curInfo.id })
      )
      .then((res) => {
        // console.log(res, "res");
        stuInfo.commit("setCourseList", res.data.classInfo);
        // console.log(this.courseList, "new list");
      })
      .catch((err) => {
        console.log(err);
      });
  },
  beforeMount() {},
  mounted() {},
  computed: {
    curRole() {
      return state.getters.getRole;
    },
    curInfo() {
      return state.getters.userInfo;
    },
    stuInfo() {
      return stuInfo.getters.getStuInfo;
    },
    courseList() {
      return stuInfo.getters.getCourseList;
    },
  },
  components: { LeftNav, TopNav },
  name: "Student",
  data() {
    return {
      asd: 1,
    };
  },

  methods: {
    test() {
      console.log(this.curInfo);
      axios
        .post("/api/getStudentsByClassId", qs.stringify({ courseId: "10086" }))
        .then((res) => {
          console.log(res);
        })
        .catch((err) => {
          console.log(err);
        });
    },
  },
};
</script>

<style scoped>
.bg {
  background-color: #f9fafc;
  margin: 0 auto;
}
</style>
